<template>
    <div>

        <el-tabs v-model="activeName" >
            <el-tab-pane label="基础信息" name="Datas">

                <el-form :model="model" ref="ruleForm" label-width="100px" class="demo-ruleForm page-form">
                     <el-row>
                        <el-col :span="8">
                            <el-form-item label="检验编号" prop="Number">
                                <el-input v-model="model.Number" placeholder="请输入检验编号"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="检验名称" prop="Name">
                                <el-input v-model="model.Name" placeholder="请输入检验名称"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="检验数量" prop="Quantity">
                                <el-input-number v-model="model.Quantity" :min="1"></el-input-number>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="检验方式" prop="Method">
                               <el-select v-model="model.Method" placeholder="请选择检验方式">
                                    <el-option label="全检" value="全检"></el-option>
                                    <el-option label="抽检" value="抽检"></el-option>
                                    <el-option label="批量检" value="批量检"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                       
                        <el-col :span="8">
                            <el-form-item label="检验版本" prop="Version">
                               <el-input v-model="model.Version" placeholder="请输入版本"></el-input>
                            </el-form-item>
                        </el-col>

                        <el-col :span="8">
                            <el-form-item label="是否启用" prop="EnableFlag" label-width="120px">
                                <el-radio-group v-model="model.EnableFlag">
                                    <el-radio label="Y">是</el-radio>
                                    <el-radio label="N">否</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="合格条件" prop="InspectCondition">
                                <el-input v-model="model.InspectCondition" placeholder="请输入合格条件"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="检验方案" prop="InspectScenario">
                                <el-input v-model="model.InspectScenario" placeholder="请输入检验方案"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="工艺标准" prop="RouteStandard">
                               <el-input v-model="model.RouteStandard" placeholder="请输入工艺标准"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row>
                         <el-col :span="8">
                            <el-form-item label="产品编号" prop="ItemCode">
                               <el-input v-model="model.ItemCode" placeholder="请选择产品编号" :readonly="true" @focus="SelecteItem"></el-input>
                            </el-form-item>
                        </el-col>

                         <el-col :span="8">
                            <el-form-item label="产品分类" prop="ProductType">
                                <el-input v-model="model.ProductType" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>

                         <el-col :span="8">
                            <el-form-item label="产品名称" prop="ItemName">
                                <el-input v-model="model.ItemName" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                        
                     </el-row>

                </el-form>
            </el-tab-pane>
            <el-tab-pane label="检测项目" name="BOM">
                <el-table :data="tableData" ref="dataForm" v-loading="isLoading" height="360" >
                    <el-table-column  prop="ProjectName" label="检测名称" :show-overflow-tooltip="true"></el-table-column>                    
                    <el-table-column prop="Classify" label="分类" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="Device" label="检测器具" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="StandValue" label="标准数值" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="StandUnit" label="标准单位" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="Remark" label="描述" :show-overflow-tooltip="true"></el-table-column>
                </el-table>
            </el-tab-pane>
        </el-tabs>
 
    </div>
</template>




<script>

export default {
    props: {
        model: {
            require: true,
            type: Object,

        }
    },
    data() {
        return {
            activeName: 'Datas',

            tableData: [],

            isLoading: false,
            
            
        }
    },
    //实例生命周期
    created() {
            this.GetQcReceiveStandardItemById(this.model.Id);
    },
    methods: {
        GetQcReceiveStandardItemById(Id) {
            this.isLoading=true;
            this.$http.get('/api/QcReceiveStandard/GetQcReceiveStandardItemById',{
                params:{
                    Id:Id
                }
            })
            .then(res => {
                this.tableData = res.Data;
                console.log(res);
                this.isLoading=false;
            })
        },
    }
   
}
</script>